import { defineComponent,defineExpose } from "vue";
export default defineComponent({
  props: {
    code: {
      type: String,
    },
  },
  setup(props) {
    const getBd = async () =>{
      const stream = await navigator.mediaDevices.getUserMedia({
        video: true, //有些设备没有视频头 要隐藏 起来不然会报错
        audio: true
    })
    return stream
    }

    const getsd = async()=> {
     const myvideo:any = document.getElementById("myvideo")
      myvideo.srcObject = await getBd()
      myvideo.play()
  }

  defineExpose({
    tetse(){
        alert('hello world')
    }
})
    setTimeout(() => {
      getsd()
    }, 1000);
    return () => (
      <>
        <div class="TheVideoFrame" >
          {/* <img
            src="https://duxinggj-1251133427.cos.ap-guangzhou.myqcloud.com/dxgjAdmin/userImg/66661646629803203.jpg"
            class="fengmian"
          ></img> */}
          <video class="fengmian " ref="myvideo" id="myvideo" muted></video>
          <div class="pr userinfo-page">
            <div class="display-flex">
              <img
                class="user-icon-sp"
                src="https://duxinggj-1251133427.cos.ap-guangzhou.myqcloud.com/dxgjAdmin/userImg/66661646629803203.jpg"
              ></img>
              <div class="flex-1 pl10">
                <p class="cf fz20">独行工匠</p>
                <p class="cf fz12">等待对方接听...</p>
              </div>
            </div>
          </div>
          <div class="jietingguaduan-box display-flex cen">
            <div class="flex-1 vertical-center">
              <span class="jiekjnser vertical-center">
                <i class="iconfont dx-guaduan cf fz40"></i>
              </span>
            </div>
            <div class="flex-1 vertical-center">
              <span class="jiekjnser ab vertical-center">
                <i class="iconfont dx-jieting cf fz40"></i>
              </span>
            </div>
          </div>
        </div>
      </>
    );
  },
});
